<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
    <style>
      #myDiv {
        width: 300px;
        height: 60px;
        /* background-color: red; */
        color: white;
        text-align: center;
        /* line-height: 200px; */
        border-top: 2px solid; /* 需要设置边框宽度和样式 */
        border-image: linear-gradient(
          to right,
          #2994fc 0%,
          rgba(41, 148, 252, 0.3) 100%
        );
        border-image-slice: 1; /* 必须设置，否则不会显示 */
        /* background-color: #333;  */
        /* background-image: linear-gradient(
          90deg,
          #2994fc 0%,
          rgba(41, 148, 252, 0) 100%
        ); */
        /* background-image: linear-gradient(90deg, #00519d 0%, #001b51 100%); */
        /*  */
        background-image: linear-gradient(90deg, #00519d 22%, #001b51 37%);
      }
    </style>
  </head>
  <body>
    <div id="myDiv">Hello World!</div>

    <script></script>
  </body>
</html>
